1. Introduction to the course

  1. Introduction
    • In this course, you will not learn how to use specific applications to design web documents.
    • You will learn frontend (also called client-side) web technologies such as HTML, CSS, JavaScript, and DOM. Mostly programming side.
    • You may learn those frontend web technologies by studying topics by topics with examples, as many other classes do.
    • However this course uses a different approach. You will start with a web application that you will analyse. The analysis will give you the list what specific how-to topics in frontend and backend (also called server-side) web technologies should be used.
    • Those specific how-to topics with some other general topics will be discussed in the following units.
  2. Learning objectives
    • Understand the major areas and challenges of web programming.
    • Distinguish web-related technologies.
    • Identify and interpret structure and content elements of an HTML document
    • Use the topics in HTML and CSS
    • Develop a basic web document with HTML elements and CSS styles
    • Design and create web document layouts with CSS using selectors, text styles, lists, pseudo-items, background, floating objects, box model, and positioning elements
    • Design and implement
      • typical static web documents, and
      • interactive web applications that include
        • reaction to mouse actions
        • tabs
        • drop-down menus
        • navigation bars, and so on

    • Briefly,
    • Define what the web programming is.
    • Understand the fundermental concepts of HTML.
    • Understand the fundermental concepts of CSS.
    • Use of HTML and CSS to design and implement interactive web applications.
    • , not
    • Cornerstones for
  3. Course projects
    • You will learn/practice the topics in this course while you develop the next web appcliations. You can try them.
      • HTML and CSS with User profile that can be used for publishing your CV
      • Event-driven programming and JavaScript with n-Puzzle Game that is a board game
      • Database with Memo that keeps any short memo in the web browser
    • What can you see from the above two applications?
      • User profile - Some different user interface styles
      • n-Puzzle Game - Not only user interface but also intensive computing
  4. Expectations
    • Self-directed learning
    • Self-motivated learning
  5. Instructor
    • Dr. Mahnhoon Lee
    • HL 424
    • (250) 377-6022
    • mlee@tru.ca
  6. How to study well - Is motivation good enough?
    • There are many general ideas. Can you suggest good ideas?
    • Some of them are more important. What are they?
    • There are two types of habits, winning habits and loosing habits.
    • Winning habits are ...
    • Loosing habits are ...